<template>
  <el-row class="markdown-body">
    <h1>{{ news.title }}</h1>
    <blockquote>
      <p>
        发布时间：{{ news.time }}<br />
        作者：<nuxt-link :to="`/author/${news.author.id}/dynamic`">{{
          news.author.name
        }}</nuxt-link
        ><br />
        浏览数：{{ news.browse }}<br />
        评论数：{{ news.comments }}
      </p>
    </blockquote>
    <div v-html="showNews"></div>
  </el-row>
</template>

<script>
import MarkdownIt from 'markdown-it'
import 'mavon-editor/resources/markdown/github-markdown.min.css'
export default {
  props: {
    news: {
      type: Object,
      default: () => {
        return {}
      },
      required: true
    }
  },
  computed: {
    showNews() {
      const news = this.news
      const md = new MarkdownIt()
      return md.render(news.content)
    }
  }
}
</script>

<style lang="scss" scoped>
/deep/ .v-show-content {
  padding: 0 !important;
}
/deep/ .v-note-wrapper {
  border: none;
}
</style>
